<template>
  <div v-if="data">
    <a-modal title="修改抖音要求" :visible="visible" :width="760" :confirm-loading="confirmLoading" @ok="handleOk" @cancel="handleCancel">
      <div>
        <TiktokForm v-if="visible" :form="data" ref="TiktokForm" />
      </div>
    </a-modal>
  </div>
</template>

<script>
import TiktokForm from './TiktokForm'
import { saveRulesBytedance, saveManagerRulesBytedance } from '@/service'

export default {
  name: 'TiktokDemandSetting',
  components: {
    TiktokForm
  },
  model: {
    props: 'value',
    event: 'change'
  },
  props: {
    value: { type: Boolean },
    data: { type: Object },
    role: { type: String, default: '0' }
  },

  data() {
    return {
      confirmLoading: false
    }
  },
  computed: {
    visible: {
      get() {
        if (!this.data) return false
        return this.value
      },
      set(v) {
        this.$emit('change', v)
      }
    }
  },
  methods: {
    async handleOk() {
      try {
        if (!this.$refs.TiktokForm.getValue()) {
          return
        }
        let TiktokForm = this.$refs.TiktokForm.getValue() || {}
        let { businessHours = null, ...otherKey } = TiktokForm
        if (TiktokForm.hasOwnProperty('businessHours')) {
          businessHours = businessHours.map((item) => {
            item = item.join('-')
            return item
          })
          businessHours = businessHours.join(',')
        }
        let params = { ...otherKey, businessHours, productId: this.data.productId }
        if (this.role == 1) {
          await saveManagerRulesBytedance(params) // 集团权限
        } else {
          await saveRulesBytedance(params) // 达运
        }

        this.$messageSend.success('成功')
        this.confirmLoading = false
        this.handleCancel()
      } catch (error) {
        this.confirmLoading = false
      }
    },
    async initData() {
      // 初始化
    },
    handleCancel() {
      this.visible = false
    }
  }
}
</script>

<style lang="scss" scpoed>
.upload-tips {
  color: #f5894e;
  font-size: 10px;
  transform: scale(1);
  line-height: 22px;
}
.tab-middle-tips {
  width: 100%;
  border-radius: 2px;
  border: 1px solid #f5894e;
  // height: 67px;
  background: rgba(245, 137, 78, 0.1);
  padding: 8px;
  line-height: normal;
}
</style>
